<template>
  <div>
       <nav class="navbar navbar-expand-sm bg-dark navbar-dark fixed-top">
  <img class="navbar-brand" src="../img/logo2.jpg" id="a1">
  <ul class="navbar-nav">
    <li class="nav-item">
      <a class="nav-link" href="#">欢迎{{$store.state.Login.name}}登录</a>
    </li>
  </ul>
</nav>
      <el-row :gutter="20" v-for="(item) in tableInfo" :key="item.sid">
  <el-col :span="5"><div class="grid-content bg-purple"><img id="a2" :src="item.img">
                </div></el-col>
  <el-col :span="16"><div class="grid-content bg-purple"><a @click="ck(item.sid)">
                          <h4>{{item.name}}</h4>
                          <p >{{item.remark}}</p>
                          <p class="item-keywords">
                                <span>适用人群：{{item.sex}}</span>
                              <span>{{item.maxage}}-{{item.minage}} </span>
                          </p>
                          <p class="mui-btn item-btn">
                              <span class="mui-btn item-btn">查看</span>  
                          </p>
                </a></div><br><br></el-col>
</el-row>
  </div>
</template>

<script>
import axios from 'axios'
export default {
    data() {
        return {
            tableInfo:[

            ]
        }
    },
    created(){
        axios.post("http://localhost:8085/tSetmealShow").then((response) => {
          this.tableInfo=response.data
         })
    },
    methods:{
        ck(sid){
            console.log(sid)
            this.$store.commit("Tcid",sid) 
            console.log(this.$store.state.tcid)
            this.$router.push('/yuytwo')
        }
    }
}
</script>

<style>
ul{
    list-style: none;
}
#a1{
  width: 35px;
  height: 40px;
}
#a2{
  width: 150px;
  height: 150px;
}
</style>